<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--Luc Bettaieb 2012-->

<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:h="http://java.sun.com/jsf/html"
	  xmlns:f="http://java.sun.com/jsf/core"
	  xmlns:ui="http://java.sun.com/jsf/facelets">
      
<h:head>
	<link rel="StyleSheet" href="style.css"></link>
	<title>Search | IHE Document Library</title>
	
	<script type="text/javascript" charset="utf-8">
		$(function(){ $("label").inFieldLabels(); });
	</script>
</h:head>

<!--
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.infieldlabel.min.js" type="text/javascript" charset="utf-8"></script>
-->	


<h:body>

<fieldset>

<script type="text/javascript">

function toggle(obj) {
	var el = document.getElementById(obj);
		
	if ( el.style.display != 'none' ) {
		el.style.display = 'none';
	}	
	else {
		el.style.display = '';
	}
}

</script>

<div id="actionBar">

<table border="0" width="100%" cellpadding="0" cellspacing="0">
	<tr>
		<td>
			<b>IHE Document Library</b>
		</td>
		
		<td style="float: right">	
			<a href="login.xhtml">Login</a>
		</td>
	</tr>
</table>

</div>

<div id="navBar">
	<a href="index.xhtml">Main</a> &#160;|&#160; 
	<a href="search.xhtml"><b>Search</b></a> &#160;|&#160; 
	<a href="upload.xhtml">Upload</a> &#160;|&#160; 
	<a href="annotate.xhtml">Annotate</a> &#160;|&#160;
	<a href="xdssubmit.xhtml">XDS Submission</a> &#160;|&#160; 
	<a href="help.xhtml">Help</a>
</div>



<div id="content"> 
<center>
<b>Search IHE Document Library</b> <br/><br/>

<h:form>
<h:inputText value="#{searchBean.query}" immediate="true" />
<h:commandButton value="Search" type="submit" actionListener="#{searchBean.doSearch()}" update="outputList" /> 
</h:form>
<br/><br/>

</center>


<table border="0" width="100%" cellpadding="0" cellspacing="0">
	<tr>
		<td valign="top" width="25%" style="border-right: 1px solid #000000">
			<b>Filter</b><br />
			<dl>
			<h:form>
				<dt> <a href="#" onclick="toggle('collection');">[+] Collection</a> </dt>
					<div style="display: none" id="collection">
						<h:dataTable id="natsTable" value="#{searchBean.nats}" var="opt">
							<h:column>
									<h:outputText value="#{opt.name}" />
							</h:column>

							<h:column>
								<h:selectBooleanCheckbox value="#{opt.isActive}" immediate="true" />
							</h:column>	
						</h:dataTable>
					</div>
				
				<dt> <a href="#" onclick="toggle('year');">[+] Year</a> </dt>
					<div style="display: none" id="year">
					
						<h:dataTable id="yearTable" value="#{searchBean.years}" var="opt">
							<h:column>
								<h:outputText value="#{opt.name}" />
							</h:column>

							<h:column>
								<h:selectBooleanCheckbox value="#{opt.isActive}" immediate="true" />
							</h:column>	
						</h:dataTable>
					</div>
				
				
				<dt> <a href="#" onclick="toggle('doctype');">[+] Document Type</a> </dt>
					<div style="display: none" id="doctype">
						<h:dataTable id="typesTable" value="#{searchBean.types}" var="opt">
							<h:column>
								
								<h:outputText value="#{opt.name}" />
							</h:column>

							<h:column>
								<h:selectBooleanCheckbox value="#{opt.isActive}" immediate="true" />
							</h:column>	
						</h:dataTable>
						
					</div>
					
				<dt> <a href="#" onclick="toggle('manufacturer');">[+] Manufacturer</a> </dt>
					<div style="display: none" id="manufacturer">
					<h:dataTable id="corpsTable" value="#{searchBean.corps}" var="opt">
							<h:column>
								<h:outputText value="#{opt.name}" />
							</h:column>
	
							<h:column>
								<h:selectBooleanCheckbox value="#{opt.isActive}" />
							</h:column>	
						</h:dataTable>
					
					

					</div>
				</h:form>
			</dl>
		</td>
		
		<td valign="top" width="75%" style="padding-left: 15px">	
			<b>Results</b> <br/> <br/>
			
			
			<!--  THIS IS OLD AND MAY NOT BE USED
			<h:form>
				<h:outputText id="outputList" value = "#{searchBean.results}"></h:outputText>
			</h:form>
			<br/><br/>
			-->
			
			<!-- New search display xhtml -->
			<ui:repeat value="#{searchBean.resultsList}" var="element" varStatus="status">
			
    			NAME: <h:outputText value="#{element.name}"/>
        			<br />
    			URL: <h:outputText value="#{element.url}" />
    				<br />
    			NAT: <h:outputText value="#{element.nationality}"/>
    				<br />
    			YEAR: <h:outputText value="#{element.year}"/>
    				<br />
    			COMP: <h:outputText value="#{element.company}"/>
    				<br />
    			TYPE: <h:outputText value="#{element.doctype}"/>	
    				<br />
    				
    				<hr />
    			<h:outputText value=" " rendered="#{not status.last}"/>
			</ui:repeat>
			
			
		</td>
	</tr>
</table>




</div>
<!-- 
<footer>footer/copyright info here.</footer>
-->
</fieldset>
</h:body>
</html>